/**
 * Created by chaofang on 2018/8/12.
 */

import React, {Component, PropTypes} from 'react';
import {
    Image,
    StyleSheet,
    Text,
    View,
    Modal,
    ScrollView,
    TouchableOpacity,
    NativeModules,
    TouchableHighlight,
    TextInput,
    Dimensions,
    Platform,
} from 'react-native';

import moment from "moment";
import Toast from "react-native-simple-toast";
import AppService from "../service/AppService";
import RString from '../language/RString';

import Edit from './Edit';
import Distribute from './Distribute';
import SuggestContent from './components/SuggestContent';
import MySuggestList from './MySuggestList';
import CommentList from './components/CommentList';
export default class suggestHandle extends Component {
    // 初始化
    constructor(props){
        super(props);
        this.state = {
            title:RString('examine_suggest'),
            userId:'',
            userName: '',
            suggestId:this.props.id,
            commentList:[],
            suggest:{},
            isProject:false,
            dealMethod:'',
            projectImgList:[],
            profitImgList:[],
            show: false,
            modalShow:false,
            filePath:null
        };
    };
    judgeProject(suggest){
        this.setState({
            isProject: suggest.isProject,
            suggest:suggest
        });
    };

    componentWillMount() {

    };

    goBack = () => {
        const{navigator} = this.props;
        if(navigator){
            navigator.pop();
        }
    };
    doClose = () => {
        NativeModules.system.navTo("BACK");
    };
    //审核不通过
    notExamineTrue = () => {
        let _this = this;
        let editSeason = this.state.editSeason;
        if(editSeason == null || editSeason.trim() == ""){
            Toast.show(RString('input_editReason'));
        }else{
            this.state.show = false;
            let vm = {
                businessId:this.state.suggestId,
                businessType: 'DOCK',
                anonymous: false,
                userId: global.userId,
                content: global.userName + RString('edit_reason') + editSeason
            };
            // 创建评论
            AppService.createCommentRecord(vm).then(data => {
                if (!!data.errors === true && !!data.errors.length > 0) {
                    Toast.show(data.errors[0].message);
                } else {
                     //审核不通过确认事件
                         let vm = {
                                  id:this.state.suggestId,
                                  isExamine: 0
                              };
                         AppService.isExamineDo(vm).then(data => {
                          if (!!data.errors === true && !!data.errors.length > 0) {
                              Toast.show(data.errors[0].message);
                          } else {
                         Toast.show('examine_submit_success');
                              setTimeout(function () {
                                const{navigator} = _this.props;
                                if (navigator) {
                                  if (global.isCoordinator) {
                                    navigator.push({
                                        name: 'CoordinationList',
                                        component: CoordinationList,
                                      });
                                  } else {
                                    navigator.push({
                                        name: 'MySuggestList',
                                        component: MySuggestList,
                                      });
                                  }
                                }
                              }, 2000);
                            }
                      });
                      }
            });
        }

    };
      //审核通过
    ExamineTrue = () => {
        let _this = this;
        let dealMethod = this.state.dealMethod;
        if(dealMethod == null || dealMethod.trim() == ""){
            Toast.show(RString('input_completion'));
        }else{
            this.state.show = false;
            let vm = {
                businessId:this.state.suggestId,
                businessType: 'DOCK',
                anonymous: false,
                userId: global.userId,
                content: global.userName +RString('project_completion')+ dealMethod
            };
            // 创建评论
            AppService.createCommentRecord(vm).then(data => {
                if (!!data.errors === true && !!data.errors.length > 0) {
                    Toast.show(data.errors[0].message);
                } else {
                  //审核通过确认事件
                   let vm = {
                            id:this.state.suggestId,
                            isExamine: 1
                        };
                   AppService.isExamineDo(vm).then(data => {
                    if (!!data.errors === true && !!data.errors.length > 0) {
                        Toast.show(data.errors[0].message);
                    } else {
                      Toast.show('examine_submit_success');
                        setTimeout(function () {
                          const{navigator} = _this.props;
                          if (navigator) {
                            if (global.isCoordinator) {
                              navigator.push({
                                  name: 'CoordinationList',
                                  component: CoordinationList,
                                });
                            } else {
                              navigator.push({
                                  name: 'MySuggestList',
                                  component: MySuggestList,
                                });
                            }
                          }
                        }, 2000);
                      }
                });
                }
            });
        }

    };

    // 显示/隐藏 modal
    _setModalVisible() {
        this.setState({
            show:!this.state.show,
        });
    }
    render() {
            let content=null;
                content=
                    <View style={{ flex:1 }}>
                        <View style={styles.comment}>
                            <Text style={{ color:'#000' }}>{RString('complete')}</Text>
                        </View>
                        <View style={{flex:1,paddingLeft:15,paddingRight:15,paddingTop:10}}>
                            <TextInput style={{flex:1}}
                                       placeholder={RString('fill_complete')}
                                       placeholderTextColor='#A9A9A9'
                                       underlineColorAndroid='transparent'
                                       multiline={true}
                                       numberOfLines={6}
                                       textAlignVertical="top"
                                       maxLength={500}
                                       onChangeText={(text)=> this.setState({dealMethod:text})}
                            />
                        </View>
                    </View>
        return (
            <View style={{ position:'relative',flex:1 }}>
                <Modal
                    animationType='slide'
                    transparent={true}
                    visible={this.state.show}
                    onShow={() => {}}
                    onRequestClose={() => {}} >
                    <View style={styles.modalStyle}>
                        <View style={styles.subView}>
                            <Text style={styles.titleText}>
                            请输入不通过原因
                            </Text>
                            <TextInput style={styles.contentText}
                               onChangeText={(text)=> this.setState({editSeason:text})}
                            />
                            <View style={styles.horizontalLine} />
                            <View style={styles.buttonView}>
                                <TouchableHighlight underlayColor='transparent'
                                                    style={styles.buttonStyle}
                                                    onPress={this._setModalVisible.bind(this)}>
                                    <Text style={styles.buttonText}>
                                        {RString('cancel')}
                                    </Text>
                                </TouchableHighlight>
                                <View style={styles.verticalLine} />
                                <TouchableHighlight underlayColor='transparent'
                                                    style={styles.buttonStyle}
                                                    onPress={this.notExamineTrue.bind(this)}>
                                    <Text style={styles.buttonText}>
                                        {RString('ensure')}
                                    </Text>
                                </TouchableHighlight>
                            </View>
                        </View>
                    </View>
                </Modal>
                <View style={styles.commonHeader}>
                    <TouchableOpacity onPress={this.goBack.bind(this)} style={styles.back}>
                        <Image source={require('./img/leftArrow.png')} />
                    </TouchableOpacity>
                    <TouchableOpacity onPress={this.doClose.bind(this)} style={styles.toIndex}>
                        <Image source={require('./img/chahao.png')}/>
                    </TouchableOpacity>
                    <View style={{ justifyContent:'center' }}>
                        <Text style={{ color:'#fff',fontSize:16 }}>{this.state.title}</Text>
                    </View>
                </View>
                <ScrollView style={styles.wrap}>
                    <SuggestContent suggestId={this.state.suggestId} judgeProject={this.judgeProject.bind(this)}/>
                      { content }
                    <View style={{ flex:1,marginBottom:30 }}>
                        <View style={styles.comment}>
                            <Text style={{ color:'#000' }}>{RString('comment')}</Text>
                        </View>
                        <CommentList suggestId={this.state.suggestId}/>
                    </View>
                </ScrollView>
                <View style={styles.buttonWrap}>
                    <View style={{ flex:1,flexDirection:'row',justifyContent:'flex-start' }}>
                        <TouchableOpacity style={styles.editBtn} onPress={this._setModalVisible.bind(this)}>
                            <Text style={{ color:'#424242' }}>不通过</Text>
                        </TouchableOpacity>
                    </View>
                    <View style={{ flex:1,flexDirection:'row',justifyContent:'flex-end' }}>
                        <TouchableOpacity style={styles.distributeBtn} onPress={this.ExamineTrue.bind(this)}>
                            <Text style={{ color:'#fff' }}>审核通过</Text>
                        </TouchableOpacity>
                    </View>
                </View>
            </View>
        );
    };
}

const styles = StyleSheet.create({
    modalLayout:{
        width:Dimensions.get('window').width,
        height:Dimensions.get('window').height,
        backgroundColor:'rgba(0,0,0,.8)'
    },
    modalView:{
        width:Dimensions.get('window').width,
        height:Dimensions.get('window').height
    },
    container:{
        flex:1,
        backgroundColor: '#ECECF0',
    },
    // modal的样式
    modalStyle: {
        // backgroundColor:'#ccc',
        alignItems: 'center',
        justifyContent:'center',
        flex:1,
    },
    // modal上子View的样式
    subView:{
        marginLeft:60,
        marginRight:60,
        backgroundColor:'#fff',
        alignSelf: 'stretch',
        justifyContent:'center',
        borderRadius: 10,
        borderWidth: 0.5,
        borderColor:'#ccc',
    },
    // 标题
    titleText:{
        marginTop:10,
        marginBottom:5,
        fontSize:16,
        fontWeight:'bold',
        textAlign:'center',
    },
    // 内容
    contentText:{
        margin:8,
        fontSize:14,
        textAlign:'center',
    },
    // 水平的分割线
    horizontalLine:{
        marginTop:5,
        height:0.5,
        backgroundColor:'#ccc',
    },
    // 按钮
    buttonView:{
        flexDirection: 'row',
        alignItems: 'center',
    },
    buttonStyle:{
        flex:1,
        height:44,
        alignItems: 'center',
        justifyContent:'center',
    },
    // 竖直的分割线
    verticalLine:{
        width:0.5,
        height:44,
        backgroundColor:'#ccc',
    },
    buttonText:{
        fontSize:16,
        color:'#3393F2',
        textAlign:'center',
    },

    wrap:{
        backgroundColor:'#fff'
    },
    commonHeader:{
        height: Platform.OS === 'android'? 50 : 60,
        paddingTop: Platform.OS === 'ios'? 20 : 0,
        backgroundColor:'#333238',
        flexDirection:'row',
        justifyContent:'center',
        position:'relative'
    },
    back:{
        width:30,
        position:'absolute',
        left:20,
        top:0,
        height: Platform.OS === 'android'? 50 : 60,
        paddingTop: Platform.OS === 'ios'? 20 : 0,
        justifyContent:'center'
    },
    toIndex:{
        width:30,
        position:'absolute',
        left:70,
        top:0,
        height: Platform.OS === 'android'? 50 : 60,
        paddingTop: Platform.OS === 'ios'? 20 : 0,
        justifyContent:'center'
    },
    detailWrap :{
        flex: 1,
        paddingLeft:10,
        paddingRight:10
    },
    detail : {
        paddingLeft:10,
        paddingRight:6,
        flexDirection: 'row'
    },
    detailTop:{
        paddingLeft:10,
        paddingRight:6,
        borderBottomWidth:1,
        borderStyle:'solid',
        borderBottomColor:'#eee',
        flexDirection: 'row'
    },
    imgWrap:{
        flex:1,
        justifyContent: 'center'
    },
    themeImg:{
        width:14,
        height:14,
        marginLeft:6
    },
    wordWrap:{
        flex:8,
        borderBottomWidth:1,
        borderStyle:'solid',
        borderBottomColor:'#eee',
        paddingTop:15,
        paddingBottom:15,
        flexDirection: 'row'
    },
    lastWordWrap:{
        flex:8,
        paddingTop:15,
        paddingBottom:15,
        flexDirection: 'row'
    },
    detailFont:{
        fontSize:16,
        color:'#000'
    },
    detailFontBold:{
        fontWeight:'bold',
        fontSize:16,
        color:'#000'
    },
    detailTime:{
        fontSize:14,
        color:'#999'
    },
    uploadImg:{
      width:80,
      height:80,
      marginRight:10,
      marginBottom:10
    },
    comment:{
        flex:1,
        height:25,
        paddingLeft:20,
        paddingRight:20,
        backgroundColor:'#ECECF1',
        justifyContent: 'center'
    },
    commentWrap:{
        flex:1,
        padding:20
    },
    buttonWrap:{
        width:Dimensions.get('window').width,
        height:55,
        backgroundColor:'#F5F5F5',
        paddingLeft:20,
        paddingRight:20,
        paddingTop:10,
        paddingBottom:10,
        flexDirection:'row',
        position:'absolute',
        left:0,
        bottom:0
    },
    editBtn:{
        width:100,
        borderWidth:0.5,
        borderStyle:'solid',
        borderColor:'#333',
        borderRadius:5,
        paddingTop:8,
        paddingBottom:8,
        flexDirection:'row',
        justifyContent:'center'
    },
    distributeBtn:{
        width:100,
        borderRadius:5,
        paddingTop:8,
        paddingBottom:8,
        backgroundColor:'#3399FF',
        flexDirection:'row',
        justifyContent:'center'
    }
});
